import React from 'react'
import axios from 'axios'
import {useEffect,useState} from "react"
function Content() {
  // 富文本就是带有一些特殊功能的文本，比如说自带样式
  let [arr,setArr] = useState([])
  useEffect(()=>{
      axios.get("/list").then(res=>{
          console.log(res.data);
          let arr1 = res.data.map((item,index)=>{
              item.tit = `<span style="color:red">${item.tit}</span>`
              return item
          })
          console.log(arr1);
          setArr(arr1)
      })
  },[])
  return (
    <div className='content'>
        {
            arr && arr.length ? arr.map((item,index)=>{
                return <div key={index}>
                        <img src={item.img} alt="" />
                        <p dangerouslySetInnerHTML={{__html:item.tit}}></p>
                </div>
            }):""
        }
    </div>
  )
}

export default Content